
{extend name="common@list" /}
{block name="jsset"}

{/block}
{block name="nav"}
	<span class="layui-breadcrumb">
		<a href="">系统管理</a>
		<a href="">类别管理</a>
		<a><cite>类别列表</cite></a>
	</span>
{/block}
{block name="search"}
		<div class="layui-form-item">
      <label for="searchval" class="layui-form-label">关键字</label>
      <div class="layui-input-block">
        <input type="text" id="searchval" name="searchval"
              autocomplete="off" class="layui-input">
      </div>
    </div>
    <div class="layui-form-item" style="margin-bottom: 0;">
		    <label for="pid" class="layui-form-label" style="height: 100%">一级类型</label>
		    <div class="layui-input-block" onclick ="clickSearchButton()">
		    	<input type="radio" name="pid" value="" title="无">
		    	{php} $pid = getCategory(0);{/php}
		    	{volist name="pid" id="vo"}
		    		<input type="radio" name="pid" value="{$vo.id}" title="{$vo.title}">
		    	{/volist}
		    </div>
		</div>
{/block}
{block name="table"}
	<table id="tabledemo" lay-filter="mytable" lay-size="sm"></table>
{/block}
{block name="myjs"}
	<!-- 表格上面按钮模板 -->
<script type="text/html" id="toolbarDemo">
	<div class="layui-btn-container">
		<button class="layui-btn layui-btn-danger" lay-event="dels">
			<i class="iconfont">&#xe69d;</i> 批量删除
		</button>
		<button class="layui-btn" lay-event="add">
			<i class="iconfont">&#xe6b9;</i> 添加
		</button>
	</div>
</script>
<!-- 记录操作按钮模板 -->
<script type="text/html" id="barDemo">
	<a class="layui-btn-xs" lay-event="edit" title="编辑"><i class="layui-icon">&#xe642;</i></a>
	<a class="layui-btn-xs" lay-event="del" title="删除"><i class="layui-icon">&#xe640;</i></a>
</script>
<!-- 表格操作 -->
<script>
    // 设置列
  options.cols=[[ //表头
      {type:'checkbox', fixed: 'left'},
      {field: 'id', title: 'ID',sort: true},
      {field: 'title', title: '名称',sort: true, minWidth:240},
      {field: "pid",title: '父级类别',sort: true,templet:function(d){
        var str='';
        if(d.gl_pid)
        {
          str = d.gl_pid.title;
        }
        return str;
      }},
      {field: 'paixu', title: '排序', sort: true},
      {field: 'status', title: '状态',templet:'#status', sort: true},
      {field: 'id', title: '操作',toolbar: '#barDemo',minWidth:140}
    ]];

  // 提交搜索条件后重载表格
    layui.use(['table','cjgl'],function(){
      var table = layui.table
          cjgl = layui.cjgl;
      //表头工具栏事件
      table.on('toolbar(mytable)', function(obj){
        switch(obj.event){
          case 'dels':
            var checkStatus = table.checkStatus('mytable'); //idmytable 即为基础参数 id 对应的值
            cjgl.delAll(checkStatus,'/category','mytable');
            break;
          case 'add':
            cjgl.add('添加类别','/category/create','450','300','');
            break;
        };
      });

      //监听行工具条
      table.on('tool(mytable)', function(obj){
        var data = obj.data; //获得当前行数据
        var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
        var tr = obj.tr; //获得当前行 tr 的DOM对象
        switch(layEvent){
          case 'detail':// 查看
            layer.msg('查看' + data.id);
            break;
          case 'del':// 删除
            cjgl.del(obj,"/category");
            break;
          case 'edit':// 编辑
            cjgl.add('编辑类别','/category/'+obj.data.id+'/edit','650','300','');
            break;
          case 'status':// 状态
            cjgl.status(obj,"{:url('setstatus')}");
            break;
        };
      });
    });
</script>
{/block}